//Super jank Audio Player Code By Elias (Keys) Palumbo.
//created april 2025.
//https://bsky.app/profile/eliasdoesathing.bsky.social

var divs = document.getElementsByClassName('music');
var defaulttextcolor="#555"

for (var i = 0; i < divs.length; i++) {
	createPlayer(divs[i])
}



function createPlayer(div)
{
	
	//create audio player track
	var track = document.createElement('div');
	track.classList.add("track")
	
	var song = document.createElement('audio');
	song.controls=false;
	
	
	var source = document.createElement('source');
	
	
	
	//get audio path from basic string
	var divsrc =  div.innerHTML;
	var splitdiv = divsrc.split("|")
	console.log(splitdiv[0]);
	console.log(splitdiv[1]);
	console.log(splitdiv[2]);
	console.log(splitdiv[3]);
	
	source.src = splitdiv[0];
	song.appendChild(source);
	
	
	if(!splitdiv[3].includes("~"))
	{	
		//if the background iamge does not show put the bottom line above the top line.(it seems to be a case by case basis)
		div.style.backgroundImage = "url('" + splitdiv[3] + "')";
	    div.style.backgroundImage ='url(' + splitdiv[3] + ')';
	    //text color
		div.style.color="#F3F3F3"
		
	}
	else{
	    div.style.color="#555";
		
	}
	
	//create artist and title
	var artist = document.createElement('p');
	artist.innerHTML=splitdiv[1]
	var title = document.createElement('h1');
	title.innerHTML=splitdiv[2]
	
	
	div.innerHTML="";
	
	
	
	
	//adds playbutton
	var playbutton = document.createElement('img');
	playbutton.src="images/play.png";
	playbutton.onclick= function() { playPause(song,playbutton); }
	
	//addslider
	var slider = document.createElement('input');
	slider.type="range";
	slider.value=0;
	slider.classList.add('progress');
	
	slider.onchange = function(){
	
		song.currentTime=slider.value;
		
		
	}
	
	//add volume slider
	var voldiv = document.createElement('div');
	voldiv.classList.add("volslide");
	var volimg = document.createElement('img');
	volimg.src="images/volume.png";
	
	var volslider = document.createElement('input');
	volslider.type="range";
	
	volslider.max=1;
	volslider.min=0;
	volslider.step=0.1;
	volslider.classList.add('vol');
	
	volslider.onchange = function(){
	
		song.volume=volslider.value;
		
		
	}
	
		//create timestamps
	var duration = document.createElement('p');
	
	var maxduration = document.createElement('p');
	
	song.onloadedmetadata = function(){
	 	
		song.volume=volslider.value;
	 	slider.max=song.duration;
	 	slider.value=song.currentTime;
	 	
		duration.innerHTML = convertTime(song.currentTime);
	 	maxduration.innerHTML = convertTime(song.duration);
	}

	
	
	
	voldiv.appendChild(volimg);
	voldiv.append(volslider);
	
	// The variable iDiv is still good... Just append to it.
	div.appendChild(artist);
	div.appendChild(title);
	div.appendChild(voldiv);
	
	track.appendChild(playbutton);
	track.appendChild(song);
	track.appendChild(duration);
	track.appendChild(slider);
	track.appendChild(maxduration);
	div.appendChild(track);
	
	
}

setInterval(()=>{
		
	RunPlayers();
		
		
		
},300);
setInterval(()=>{
		
	setvolume();
		
		
		
},1);

function setvolume(){
	for (var i = 0; i < divs.length; i++) {
		
		var track = divs[i].childNodes[3];
		var voldiv = divs[i].childNodes[2];
		var volslider = voldiv.childNodes[1];
		
		var song = track.childNodes[1];
		
		song.volume=volslider.value;
		
	
		
		
	}
	
	
	
}


function RunPlayers()
{
	
	for (var i = 0; i < divs.length; i++) {
		
		var track = divs[i].childNodes[3];
	
		
		var song = track.childNodes[1];
		
		
		
		var slider = track.childNodes[3];
		var duration = track.childNodes[2];
		
		if(!song.paused){
			
			duration.innerHTML = convertTime(song.currentTime)
			
			slider.value=song.currentTime;
			
		}
		
		
	}
	
	
}




function playPause(song,pbtn){
	
	if(song.paused)
	{
	    song.play();
		pbtn.src="images/pause.png";
	}
	else{
		song.pause();
		pbtn.src="images/play.png";
	}
	
	
}
function convertTime(time)
{    
	var mins = Math.floor(time / 60);
	if (mins < 10) {
		mins = '0' + String(mins);
	}
	var secs = Math.floor(time % 60);
	if (secs < 10) {
		secs = '0' + String(secs);
	}

	return mins + ':' + secs;
}
